<template>
	<view class="container">
		<Header :isBack="true">
			<block slot="content">{{title}}</block>
		</Header>
		<view class="">
			<view class="list-cell b-b m-t" @click="password1">
				<text class="cell-tit">登录密码</text>
				<text class="cell-more yticon icon-you"></text>
			</view>
			<view class="list-cell b-b" @click="password2" v-show="cate == 1">
				<text class="cell-tit">支付密码</text>
				<text class="cell-more yticon icon-you"></text>
			</view>
			<view class="list-cell b-b" @click="deleteMsg">
				<text class="cell-tit">删除信息</text>
				<!-- <text class="cell-more yticon icon-you"></text> -->
			</view>
			<view class="list-cell b-b" @click="deleteAccount">
				<text class="cell-tit">注销账号</text>
				<!-- <text class="cell-more yticon icon-you"></text> -->
			</view>
		</view>

		<uni-popup ref="alert1" type="dialog">
			<uni-popup-dialog :type="msgType" title="退出确认" content="" @confirm="confirm1">
				<view class="" style="font-size: 30rpx;">
					确定要删除信息吗？
				</view>
			</uni-popup-dialog>
		</uni-popup>

		<uni-popup ref="alert2" type="dialog">
			<uni-popup-dialog :type="msgType" title="退出确认" content="" @confirm="confirm2">
				<view class="" style="font-size: 30rpx;">
					确定要注销该账号吗？
				</view>
			</uni-popup-dialog>
		</uni-popup>

	</view>

</template>

<script>
	import {
		mapMutations
	} from 'vuex';
	export default {
		data() {
			return {
				title: '账户与安全',
				cate: 1,
				msgType: 'info',
			};
		},
		onLoad() {
			let result = this.$api.isLogin();
			if (result === false) {
				return false;
			}

			if ([1, 2].indexOf(uni.getStorageSync('cate')) > -1) {
				this.cate = uni.getStorageSync('cate')
			}

		},
		methods: {
			...mapMutations(['logout']),

			password1() {
				uni.navigateTo({
					url: "/pages6/pages/check-code/check-code?field=password1&title=修改登录密码"
				})
			},

			password2() {
				uni.navigateTo({
					url: "/pages6/pages/check-code/check-code?field=password2&title=修改支付密码"
				})
			},

			deleteMsg() {
				this.$refs.alert1.open()
			},

			async confirm1() {
				let cate = uni.getStorageSync('cate')
				let url = '/udeleteMsg';
				if (cate == 2) {
					url = '/cdeleteMsg'
				}

				let res = await this.$myRequest({
					url: url,
					data: {
						token: uni.getStorageSync('token')
					},
					methods: 'post'
				})

				this.$api.msg(res.data.msg);
			},

			deleteAccount() {
				this.$refs.alert2.open()
			},

			async confirm2() {
				let cate = uni.getStorageSync('cate')
				let url = '/udeleteAccount';
				if (cate == 2) {
					url = '/cdeleteAccount'
				}

				let res = await this.$myRequest({
					url: url,
					data: {
						token: uni.getStorageSync('token')
					},
					methods: 'post'
				})

				this.$api.msg(res.data.msg);
				setTimeout(() => {
					uni.navigateTo({
						url: '/pages/login/login'
					})
				}, 1500)
			}
		}
	}
</script>
<style>
	page {
		background-color: #f7f7f7;
		font-size: $font-base;
	}
</style>
<style lang='scss'>
	.container {
		// #ifdef APP-PLUS
		padding-top: 160rpx;
		// #endif

		// #ifdef H5
		padding-top: 100rpx;
		// #endif

		// #ifdef MP-WEIXIN
		padding-top: 160rpx;
		// #endif
	}

	.list-cell {
		display: flex;
		align-items: baseline;
		padding: 20upx $page-row-spacing;
		line-height: 60upx;
		position: relative;
		background: #fff;
		justify-content: center;
		font-size: $font-base;

		&.log-out-btn {
			margin-top: 40upx;

			.cell-tit {
				color: $uni-color-primary;
				text-align: center;
				margin-right: 0;
			}
		}

		&.cell-hover {
			background: #fafafa;
		}

		&.b-b:after {
			left: 30upx;
		}

		.cell-more {
			align-self: baseline;
			/* font-size: $font-lg; */
			color: $font-color-light;
			margin-left: 10upx;
		}

		.cell-tit {
			flex: 1;
			/* font-size: $font-base + 2upx; */
			color: $font-color-dark;
			margin-right: 10upx;
		}

		.cell-tip {
			/* font-size: $font-base; */
			color: $font-color-light;
		}

		switch {
			transform: translateX(16upx) scale(.84);
		}
	}
</style>
